<!--
This example demonstrates the minimum amount of code required to use Mergely.
-->
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8"/>
    <title>Mergely - Simple Example</title>
    <meta http-equiv="X-UA-Compatible" content="chrome=1, IE=edge">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <meta name="description" content="Merge and Diff your documents with diff online and share"/>
    <meta name="keywords" content="diff,merge,compare,jsdiff,comparison,difference,file,text,unix,patch,algorithm,saas,longest common subsequence"/>
    <meta name="author" content="Jamie Peabody"/>

    <!-- Requires jQuery -->
    <script type="text/javascript" src="../../jquery.min.js"></script>

    <!-- Requires CodeMirror -->
    <script type="text/javascript" src="../lib/codemirror_5.32.0.min.js"></script>
    <script type="text/javascript" src="../lib/searchcursor.min.js"></script>
    <link type="text/css" rel="stylesheet" href="../lib/codemirror_5.32.0.min.css"/>

    <!-- Requires Mergely -->
    <script type="text/javascript" src="../lib/mergely.js"></script>
    <script type="text/javascript" src="../../gzip/pako.min.js"></script>
    <script type="text/javascript" src="../../gzip/base64_gzip.js"></script>

    <script type="text/javascript" src="../../sql/codemirror.js"></script>
    <script type="text/javascript" src="../../sql/matchbrackets.js"></script>
    <script type="text/javascript" src="../../sql/javascript.js"></script>
<!--    <script type="text/javascript" src="../../sql/show-hint.js"></script>-->

    <link type="text/css" rel="stylesheet" href="../lib/mergely.css"/>
<!--    <link rel="stylesheet" href="../../../../css/plugin/sql/codemirror.css" />-->
<!--    <link rel="stylesheet" href="../../../../css/plugin/sql/show-hint.css" />-->
    <link rel="stylesheet" href="../../../../css/bootstrap_sybn_custom.css" />
    <style>
    .script_div > .CodeMirror{min-height:90px;height:calc(100% - 2.5em);border: 1px solid #ccc;}
    .mergely_div{height:80vh; min-height:300px; }
    .script_div{height:20vh; min-height:120px;}
    input{width:99.5%}
    textarea{width:99.5%;height:200px;}
    </style>
    <title>sql检查工具</title>
    <script type="text/javascript">
		$(document).ready(function () {
			
		});
function compare() {
    var s1 = $("#s1").val();
    var s2 = $("#s2").val();
    var s3 = "";
    var nep_reg = /.*\S+.*/; //空白符和字符串，字符串
    var target_list = s1.replace("[","").replace("]","").replace("\"","").replace("'","").replace(/\s*,\s*/,",").split(',');
 
    var allSet = new Set();
 
    // 使用split按行分割文本
    var lines = s2.split('\n');
    // 遍历每一行
    lines.forEach(function(line) {
        if (!nep_reg.test(line)) {
            // 空行
            s3 += line + "\r\n";
            return;
        }
        
        // 处理每一行的代码
        var l = line.split('//')[0].trim();
        var test_list = l.toLowerCase().replace("[","").replace("]","").replace("\"","").replace("'","").replace(/\s*,\s*/,",").split(',');
        
        let missing = target_list.filter(item => !test_list.includes(item));
        let extra = test_list.filter(item => !target_list.includes(item));
        let inter = target_list.filter(item => test_list.includes(item));
        test_list.forEach(item => allSet.add(item));
        
        s3 += l + "\t// 交集:\t" + inter.length + "\t缺少:\t" + missing.length + "\t多余:\t" + extra.length + "\t" + (extra.length==0?"全覆盖":extra.join(',')) + "\r\n";
         $("#s2").val(s3)
    });
    
    var allSet2 = Array.from(allSet);
    $("#allDataSize").text(allSet2.length + "张表" );
    $("#allData").text(allSet2.join(', '));
}

    </script>
</head>
<body>

<div class="mergely-full-screen-8">
    <div class="mergely-resizer">
        <div class="script_div">
            <input id="s1" type="text" name="s1" value="coupon_apply,ci_dictionary_key,pos_sale_bill_coupon,pos_sale_goods_coupon,sch_plan,coupon_order_item,trade_order_subsidy,m_member_card_shard_tenantid,pos_movie_ticket_flow,pos_sale_bill_pay_ticket,ci_hall,pos_sale_goods_pay,sch_plan_time,pos_sale_bill_goods,pos_movie_ticket,pos_sale_bill_pay,pos_sale_bill"/><br/>
            <textarea id="s2" name="s2" > </textarea>
            <label>相似度 <button onclick="compare()">计算</button></label>
            <br/>
            <p>所有值: <span id="allDataSize"></span><br/><span id="allData"/></span></p>
        </div>
        
    </div>
</div>
</body>
</html>
